<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Floating Action Button Demo | Onsen UI</title>
  <link rel="stylesheet" href="../../build/css/onsenui.css">
  <link rel="stylesheet" href="../../build/css/onsen-css-components.css">

  <script src="../../build/js/onsenui.js"></script>

</head>
<body>
  <ons-page>
    <ons-toolbar>
      <div class="center">Floating Action Button</div>
    </ons-toolbar>

    <section style="text-align:center;">
      <p></p>
      <ons-fab>
        <ons-icon
          icon="md-car">
        </ons-icon>
      </ons-fab>

      <ons-fab disabled>
        <ons-icon icon="md-car"></ons-icon>
      </ons-fab>

      <ons-fab ripple>-</ons-fab>

      <ons-fab modifier="mini">
        <ons-icon icon="md-car"></ons-icon>
      </ons-fab>

      <ons-fab position="center bottom">
        <ons-icon icon="md-car"></ons-icon>
      </ons-fab>

      <ons-fab position="right bottom">
        <ons-icon icon="md-car"></ons-icon>
      </ons-fab>

      <ons-fab position="left bottom">
        <ons-icon icon="md-car"></ons-icon>
      </ons-fab>

    </section>

  </ons-page>
</body>
</html>
